<template>
    <view>
        <scroll-view class="list" scroll-y="true" refresher-enabled="true" :refresher-triggered="triggered"
            @refresherrefresh="onRefresh" @scrolltolower="onScrollTolower">
            <view class="item" v-for="item in list" :key="item.id">
                <u-swipe-action>
                    <u-swipe-action-item :options="options1" @click="onDelete(item.id)">
                        <view class="swipe-action u-border-top u-border-bottom btn-right">
                            <view>
                                <view class="swipe-action__content">
                                    <text class="swipe-action__content__text">订单号:{{ item.code }}</text>
                                </view>
                                <view class="swipe-action__content">
                                    <text class="swipe-action__content__text">订购课程:{{ item.srder.title }}</text>
                                </view>
                                <view class="swipe-action__content">
                                    <text class="swipe-action__content__text">交易客户:{{ item.user.nickname ? item.user.nickname : item.user.mobile}}</text>
                                </view>
                                <view class="swipe-action__content">
                                    <text class="swipe-action__content__text">交易金额:{{ item.total }}</text>
                                </view>
                            </view>
                        </view>
                    </u-swipe-action-item>
                </u-swipe-action>
            </view>
        </scroll-view>

        <u-toast ref="uToast"></u-toast>
        <u-modal :show="show" :title="title" :content="content" @confirm="onConfirm" showCancelButton
            @cancel="show = !show" />
    </view>
</template>

<script>
export default {
    data() {
        return {
            LoginAdmin: {},
            list: [],
            page: 1,
            limit: 10,
            listCount: 0,
            show: false,
            // 下拉刷新状态
            triggered: false,
            // 上拉加载状态
            finished: false,
            options1: [
                {
                    text: "删除",
                    style: {
                        backgroundColor: "#dd524d",
                    },
                },
            ],
            // 删除id
            id: 0,
            title: "未知标题",
            content: "未知内容",
        };
    },
    methods: {
        // 下滑加载
        onScrollTolower() {
            if (this.finished) {
                return;
            }
            this.page = this.page + 1;
            this.getList();
        },
        // 下拉刷新
        onRefresh() {
            // 开启下拉刷新
            this.triggered = true;
            // 加载状态为false
            this.finished = false;
            this.page = 1;
            this.list = [];
            this.getList();
        },
        // 获取课程订单数据
        async getList() {
            let data = {
                page: this.page,
                limit: this.limit,
                adminid: this.LoginAdmin.id
            }

            let result = await this.$u.api.manage.subjectindex(data);

            this.triggered = false;

            if (result && result.code === 1) {
                this.listCount = result.data.count;
                this.list = this.list.concat(result.data.list);
            } else {
                this.finished = true;
                this.$refs.uToast.show({
                    type: "error",
                    message: result.msg,
                });
                return;
            }
        },

        // 点击删除
        onDelete(id) {
            this.id = id;
            this.show = !this.show;
            this.title = "删除客户";
            this.content = "是否删除该客户？";
            this.action = "onDelete";
        },

        // 确认删除
        async onConfirm() {
            let data = {
                id: this.id
            }

            let result = await this.$u.api.manage.subjectdelete(data);

            if (result && result.code === 1) {
                this.$refs.uToast.show({
                    type: "success",
                    message: result.msg,
                });
                this.show = !this.show;
                setTimeout(() => {
                    this.$router.go(0);
                }, 1500);
                return;
            }else{
                this.$refs.uToast.show({
                    type: "error",
                    message: result.msg,
                })
            }
        }
    },
    onLoad() {
        this.LoginAdmin = uni.getStorageSync("admin") ?? {};

        this.getList();
    }
}
</script>

<style lang="scss">
.list {
    /* #ifdef H5 || APP-PULS */
    height: 100vh;
    /* #endif */

    /* #ifdef MP-WEIXIN */
    height: 94vh;
    /* #endif */
    overflow: hidden;
}

.btn {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    margin-right: 3vw;
}

.btn-right {
    display: flex;
    justify-content: space-between;
}

.u-page {
    padding: 0;
}

.u-demo-block__title {
    padding: 10px 0 2px 15px;
}

.swipe-action {
    &__content {
        padding: 25rpx 0;

        &__text {
            font-size: 15px;
            color: $u-main-color;
            padding-left: 30rpx;
        }
    }
}
</style>
